<!DOCTYPE HTML>
<html>
    <head>
        <title>Example</title>
        <meta name="author" content="Adam Freeman"/>
        <meta name="description" content="A simple example"/>
        <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
        <style>
            li.inside {
                list-style-position: inside;
            }
            li.outside {
                list-style-position: outside;
            }
            li {
                background-color: lightgrey;
            }            
        </style>
    </head>
    <body>
        I like apples and oranges.
        
        I also like:
        <ul>
            These are the inside items:
            <li class="inside">bananas</li>
            <li class="inside">mangoes</li>
            <li class="inside">cherries</li>
            These are the outside items:
            <li class="outside">plums</li>
            <li class="outside">peaches</li>
            <li class="outside">grapes</li>
        </ul>
    </body>
</html>
